<!DOCTYPE html>
<html>
<meta charset="utf-8">
<html xmlns:th="http://www.thymeleaf.org">
<head th:include="include :: header"></head>
<body class="gray-bg">
<div class="wrapper wrapper-content ">
    <div class="row">
        <div class="col-sm-12">
            <div class="ibox float-e-margins">
                <div class="ibox-content">
                    <form class="form-horizontal m-t" id="signupForm">
                        <div class="form-group">
                            <label class="col-sm-3 control-label">姓名：</label>
                            <div class="col-sm-8">
                                <input type="hidden" name="userId" th:value="${user.userId}">
                                <input type="hidden" name="roleIds" id="roleIds">
                                <input id="name" class="form-control" type="text" name="name" th:value="${user.name}">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label">用户名：</label>
                            <div class="col-sm-8">
                                <input id="username" class="form-control"
                                       type="text" name="username"  th:value="${user.username}">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label">密码：</label>
                            <div class="col-sm-8">
                                <input id="password" class="form-control"
                                       type="password" name="password">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label">E-mail：</label>
                            <div class="col-sm-8">
                                <input id="email" class="form-control"
                                       type="email" name="email" th:value="${user.email}">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label">状态:</label>
                            <div class="col-sm-8">
                                <label class="radio-inline"> <input type="radio"
                                                                    value="1" name="status" /> 正常
                                </label> <label class="radio-inline"> <input type="radio"
                                                                             value="0"  name="status" /> 禁用
                            </label>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label">角色</label>
                            <div class="col-sm-8">
                                <label class="checkbox-inline"th:each="role:${list}">
                                    <input name="role" type="checkbox" th:value="${role.roleId}" th:text="${role.roleName}"
                                    >
                                </label>
                            </div>
                        </div>
                        <div class="form-group">
                            <div class="col-sm-8 col-sm-offset-3">
                                <button type="submit" class="btn btn-primary">提交</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>

</div>
<div th:include="include::footer"></div>
</body>
<script th:inline="javascript" >
    //设置默认的被validator管理的方法
    $.validator.setDefaults({
        submitHandler:function () {
            save();
        }
    })
    //使用validate
    $(function () {

        var role=[[${role}]];


            for(var i=0;i<role.length;i++){

          $('[name="role"][value="'+role[i]+'"]').attr("checked",true);

        }


        $('#signupForm').validate({
            rules:{
                name:{
                    required:true
                },
                username:{
                    required:true,
                    minlength:4,
                    remote:{
                        url:'/sys/user/hasUser',
                        data:{
                            username:function () {
                                return $('#username').val();
                            }
                        },dataType:'json',
                        type:'get'
                    }
                }
            },
            messages:{
                name:{
                    required:"用户名不能为空"
                },
                username:{
                    required:"用户名不能为空",
                    minlength:"用户名不能少于4位",

                    remote:"用户名已存在"

                }
            }
        })

    })
    function save() {
        //在提交之前先获取复选框中被选中的赋给form表单中的有一个属性

        getSelectId();
        $.post(
            "/sys/user/update",
            $('form').serialize(),
            function (data) {

                if(data.code==200){
                    parent.layer.close(parent.layer.getFrameIndex(window.name));
                   parent.reload();
                }else{
                    parent.layer.alert(data.msg);
                }
            },"json"
        )
    }
    function getSelectId() {
        //定义一个roleIds数组
        var roleIds=[];
        //获取所有input zhong name =role的被选中的
        $('input[name=role]:checked').each(function (i) {
            //用push的方法把它放入数组中
            roleIds.push($(this).val());
        })
        //再赋值给定义好的input 表单中的隐藏表单方便提交
        $('#roleIds').val(roleIds);
    }

</script>
</html>
